<template>
  <div id="left1" style="width: 100%;height: 100%;"> 
  </div>
</template>

<script>
import { Line } from '@antv/g2plot';
import {get} from '@/utils/request';
  export default {
    mounted(){
      this.gettodaydata();
      this.initleft1();
    },
    methods:{
      initleft1(){
        const data = [
          { year: '1991', value: 3 },
          { year: '1992', value: 4 },
          { year: '1993', value: 3.5 },
          { year: '1994', value: 5 },
          { year: '1995', value: 4.9 },
          { year: '1996', value: 6 },
          { year: '1997', value: 7 },
          { year: '1998', value: 9 },
          { year: '1999', value: 13 },
        ];

        const line = new Line('left1', {
          data,
          xField: 'year',
          yField: 'value',
          label: {},
          point: {
            size: 5,
            shape: 'diamond',
            style: {
              fill: 'white',
              stroke: '#5B8FF9',
              lineWidth: 2,
            },
          },
          xAxis:{
            label: {
            style: {
              fill: 'white',
              }
             }
          },
          yAxis:{
            label: {
            style: {
              fill: 'white',
              }
             }
          },
         tooltip: { showMarkers: false },
         formatter: (datum) => {
                  return { name: '温度', value: datum.value +'°C' };
                 },
                  state: {
                   active: {
                    style: {
                      shadowBlur: 4,
                      stroke: '#000',
                       fill: 'red',
                         },
                         },
                          },
             interactions: [{ type: 'marker-active' }],
        });

          line.render();
      },
     async gettodaydata(){
        let params={
          page:1,
          pageSize:10,

        }
        let res=await get('/dashboard/pageQueryTodayData',params)
        console.log(res)
      }
    }
    
  }
</script>

<style scoped>

</style>